Message layout will update according to the selected style #10170

manancodes · 2023-02-15T16:05:56Z

Checklist

Tests written for new code (and old code if feasible)
Linter and other CI checks pass
Sign-off given on the changes (see CONTRIBUTING.md)

Fixes element-hq/element-web#21782

Type: enhancement

Here's what your changelog entry will look like:

✨ Features

Message layout will update according to the selected style (#10170). Fixes Font Size preview doesn't change on changing the message layout element-hq/element-web#21782. Contributed by @manancodes.

weeman1337

Thanks for you contribution @manancodes . Can you have a look at my suggestion?

src/components/views/settings/FontScalingPanel.tsx

manancodes · 2023-02-16T09:45:29Z

@weeman1337 thanks for the quick response. I agree with your suggestion. I wasn't very sure about my implementation.
This is my first contribution, and I'm not very familiar with the project. I will work on it. Thanks

…iew_update

manancodes · 2023-03-29T09:21:38Z

@weeman1337 @t3chguy I took reference from other files for a clean approach to get the value and used it. Please let me know if any further changes are required.

Also please let me know if there are other issues that you think I can work on. It really hard to find issues which others are not working on.

t3chguy

This looks great other than the typescript fail, think it just wants the type to become optional

…iew_update

manancodes · 2023-07-18T09:19:07Z

This looks great other than the typescript fail, think it just wants the type to become optional

I've marked the class property as optional. Thanks

src/components/views/settings/FontScalingPanel.tsx

…iew_update

into manancodes/message_layout_preview_update

…iew_update

src/components/views/settings/FontScalingPanel.tsx

Co-authored-by: Michael Telatynski <[email protected]>

t3chguy

Looks great, thanks!

manancodes · 2023-09-22T13:12:03Z

Also, @t3chguy , do you thing the approach should be changed in other files too?

For example in src/components/views/right_panel/TimelineCard.tsx, Line no. 102 this is how it's implemented

        this.layoutWatcherRef = SettingsStore.watchSetting("layout", null, (...[, , , value]) =>
            this.setState({ layout: value as Layout }),
        );

t3chguy · 2023-09-22T13:42:16Z

@manancodes I don't think its crucial, I think Settings is on the chopping block for a rewrite which should make this less foot-gunny - thanks for persevering.

stale

@stefanceriu

Changes in [1.11.47](https://github.com/vector-im/element-web/releases/tag/v1.11.47) (2023-10-24) ================================================================================================= ## 🦖 Deprecations * Deprecate customisations in favour of Module API ([\#25736](element-hq/element-web#25736)). Fixes #25733. ## ✨ Features * element-hq/element-x-ios/issues/1824 - Convert the apple-app-site-association file to a newer format… ([\#26307](element-hq/element-web#26307)). Contributed by @stefanceriu. * Iterate `io.element.late_event` decoration ([\#11760](matrix-org/matrix-react-sdk#11760)). Fixes #26384. * Render timeline separator for late event groups ([\#11739](matrix-org/matrix-react-sdk#11739)). * OIDC: revoke tokens on logout ([\#11718](matrix-org/matrix-react-sdk#11718)). Fixes #25394. Contributed by @kerryarchibald. * Show `io.element.late_event` in MessageTimestamp when known ([\#11733](matrix-org/matrix-react-sdk#11733)). * Show all labs flags if developerMode enabled ([\#11746](matrix-org/matrix-react-sdk#11746)). Fixes #24571 and #8498. * Use Compound tooltips on MessageTimestamp to improve UX of date time discovery ([\#11732](matrix-org/matrix-react-sdk#11732)). Fixes #25913. * Consolidate 4s passphrase input fields and use stable IDs ([\#11743](matrix-org/matrix-react-sdk#11743)). Fixes #26228. * Disable upgraderoom command without developer mode enabled ([\#11744](matrix-org/matrix-react-sdk#11744)). Fixes #17620. * Avoid rendering app download buttons if disabled in config ([\#11741](matrix-org/matrix-react-sdk#11741)). Fixes #26309. * OIDC: refresh tokens ([\#11699](matrix-org/matrix-react-sdk#11699)). Fixes #25839. Contributed by @kerryarchibald. * OIDC: register ([\#11727](matrix-org/matrix-react-sdk#11727)). Fixes #25393. Contributed by @kerryarchibald. * Use stable get_login_token and remove unstable MSC3882 support ([\#11001](matrix-org/matrix-react-sdk#11001)). Contributed by @hughns. ## 🐛 Bug Fixes * Set max size for Element logo in search warning ([\#11779](matrix-org/matrix-react-sdk#11779)). Fixes #26408. * Avoid error when DMing oneself ([\#11754](matrix-org/matrix-react-sdk#11754)). Fixes #7242. * Fix: Message shield alignment is not right. ([\#11703](matrix-org/matrix-react-sdk#11703)). Fixes #26142. Contributed by @manancodes. * fix logging full event ([\#11755](matrix-org/matrix-react-sdk#11755)). Fixes #26376. * OIDC: use delegated auth account URL from `OidcClientStore` ([\#11723](matrix-org/matrix-react-sdk#11723)). Fixes #26305. Contributed by @kerryarchibald. * Fix: Members list shield alignment is not right. ([\#11700](matrix-org/matrix-react-sdk#11700)). Fixes #26261. Contributed by @manancodes. * Fix: <detail> HTML elements clickable area too wide. ([\#11666](matrix-org/matrix-react-sdk#11666)). Fixes #25454. Contributed by @manancodes. * Fix untranslated headings in the devtools dialog ([\#11734](matrix-org/matrix-react-sdk#11734)). * Fixes invite dialog alignment and pill color contrast ([\#11722](matrix-org/matrix-react-sdk#11722)). Contributed by @gabrc52. * Prevent select element in General settings overflowing in a room with very long room-id ([\#11597](matrix-org/matrix-react-sdk#11597)). Contributed by @ABHIXIT2. * Fix: Clicking on members pile does nothing. ([\#11657](matrix-org/matrix-react-sdk#11657)). Fixes #26164. Contributed by @manancodes. * Fix: Wierd shadow below room avatar in dark mode. ([\#11678](matrix-org/matrix-react-sdk#11678)). Fixes #26153. Contributed by @manancodes. * Fix start_sso / start_cas URLs failing to redirect to a authentication prompt ([\#11681](matrix-org/matrix-react-sdk#11681)). Contributed by @Half-Shot. Changes in [1.11.46](https://github.com/vector-im/element-web/releases/tag/v1.11.46) (2023-10-10) ================================================================================================= ## ✨ Features * Use .well-known to discover a default rendezvous server for use with Sign in with QR ([\#11655](matrix-org/matrix-react-sdk#11655)). Contributed by @hughns. * Message layout will update according to the selected style ([\#10170](matrix-org/matrix-react-sdk#10170)). Fixes #21782. Contributed by @manancodes. * Implement MSC4039: Add an MSC for a new Widget API action to upload files into the media repository ([\#11311](matrix-org/matrix-react-sdk#11311)). Contributed by @dhenneke. * Render space pills with square corners to match new avatar ([\#11632](matrix-org/matrix-react-sdk#11632)). Fixes #26056. * Linkify room topic ([\#11631](matrix-org/matrix-react-sdk#11631)). Fixes #26185. * Show knock rooms in the list ([\#11573](matrix-org/matrix-react-sdk#11573)). Contributed by @maheichyk. ## 🐛 Bug Fixes * Bump matrix-web-i18n dependency to 3.1.3 ([\#26287](element-hq/element-web#26287)) * Fix: Avatar shrinks with long names ([\#11698](matrix-org/matrix-react-sdk#11698)). Fixes #26252. Contributed by @manancodes. * Update custom translations to support nested fields in structured JSON ([\#11685](matrix-org/matrix-react-sdk#11685)). * Fix: Edited message remove button is hard to reach. ([\#11674](matrix-org/matrix-react-sdk#11674)). Fixes #24917. Contributed by @manancodes. * Fix: Theme selector radio button not aligned in center with the text ([\#11676](matrix-org/matrix-react-sdk#11676)). Fixes #25460. Contributed by @manancodes. * Fix: Unread notification dot aligned ([\#11658](matrix-org/matrix-react-sdk#11658)). Fixes #25285. Contributed by @manancodes. * Fix: sync intentional mentions push rules with legacy rules ([\#11667](matrix-org/matrix-react-sdk#11667)). Fixes #26227. Contributed by @kerryarchibald. * Revert "Fix regression around FacePile with overflow (#11527)" ([\#11634](matrix-org/matrix-react-sdk#11634)). Fixes #26209. * Fix: Alignment Fixed ([\#11648](matrix-org/matrix-react-sdk#11648)). Fixes #26169. Contributed by @manancodes. * Fix: onFinished added which closes the menu ([\#11647](matrix-org/matrix-react-sdk#11647)). Fixes #25556. Contributed by @manancodes. * Don't start key backups when opening settings ([\#11640](matrix-org/matrix-react-sdk#11640)). * Fix add to space avatar text centering ([\#11643](matrix-org/matrix-react-sdk#11643)). Fixes #26154. * fix avatar styling in lightbox ([\#11641](matrix-org/matrix-react-sdk#11641)). Fixes #26196.

@hughns

…ixed yet) * Use .well-known to discover a default rendezvous server for use with Sign in with QR ([\#11655](matrix-org/matrix-react-sdk#11655)). Contributed by @hughns. * Message layout will update according to the selected style ([\#10170](matrix-org/matrix-react-sdk#10170)). Fixes #21782. Contributed by @manancodes. * Implement MSC4039: Add an MSC for a new Widget API action to upload files into the media repository ([\#11311](matrix-org/matrix-react-sdk#11311)). Contributed by @dhenneke. * Render space pills with square corners to match new avatar ([\#11632](matrix-org/matrix-react-sdk#11632)). Fixes #26056. * Linkify room topic ([\#11631](matrix-org/matrix-react-sdk#11631)). Fixes #26185. * Show knock rooms in the list ([\#11573](matrix-org/matrix-react-sdk#11573)). Contributed by @maheichyk. * Bump matrix-web-i18n dependency to 3.1.3 ([\#26287](element-hq/element-web#26287)) * Fix: Avatar shrinks with long names ([\#11698](matrix-org/matrix-react-sdk#11698)). Fixes #26252. Contributed by @manancodes. * Update custom translations to support nested fields in structured JSON ([\#11685](matrix-org/matrix-react-sdk#11685)). * Fix: Edited message remove button is hard to reach. ([\#11674](matrix-org/matrix-react-sdk#11674)). Fixes #24917. Contributed by @manancodes. * Fix: Theme selector radio button not aligned in center with the text ([\#11676](matrix-org/matrix-react-sdk#11676)). Fixes #25460. Contributed by @manancodes. * Fix: Unread notification dot aligned ([\#11658](matrix-org/matrix-react-sdk#11658)). Fixes #25285. Contributed by @manancodes. * Fix: sync intentional mentions push rules with legacy rules ([\#11667](matrix-org/matrix-react-sdk#11667)). Fixes #26227. Contributed by @kerryarchibald. * Revert "Fix regression around FacePile with overflow (#11527)" ([\#11634](matrix-org/matrix-react-sdk#11634)). Fixes #26209. * Fix: Alignment Fixed ([\#11648](matrix-org/matrix-react-sdk#11648)). Fixes #26169. Contributed by @manancodes. * Fix: onFinished added which closes the menu ([\#11647](matrix-org/matrix-react-sdk#11647)). Fixes #25556. Contributed by @manancodes. * Don't start key backups when opening settings ([\#11640](matrix-org/matrix-react-sdk#11640)). * Fix add to space avatar text centering ([\#11643](matrix-org/matrix-react-sdk#11643)). Fixes #26154. * fix avatar styling in lightbox ([\#11641](matrix-org/matrix-react-sdk#11641)). Fixes #26196.

message_layout_preview_update

4d14036

manancodes requested a review from a team as a code owner February 15, 2023 16:05

manancodes requested review from germain-gg and t3chguy February 15, 2023 16:05

github-actions bot added the Z-Community-PR Issue is solved by a community member's PR label Feb 15, 2023

github-actions bot deployed to Netlify February 15, 2023 16:18 View deployment

weeman1337 previously requested changes Feb 16, 2023

View reviewed changes

src/components/views/settings/FontScalingPanel.tsx Outdated Show resolved Hide resolved

germain-gg removed their request for review February 28, 2023 08:13

manancodes and others added 2 commits March 29, 2023 13:42

Merge branch 'matrix-org:develop' into manancodes/message_layout_prev…

fe7c791

…iew_update

using_settings_watcher

877774a

manancodes requested review from weeman1337 and removed request for t3chguy March 29, 2023 09:17

github-actions bot added the T-Enhancement New features, changes in functionality, performance boosts, user-facing improvements label Mar 29, 2023

Merge branch 'develop' into manancodes/message_layout_preview_update

394f3e8

github-actions bot deployed to Netlify July 10, 2023 09:53 View deployment

t3chguy suggested changes Jul 10, 2023

View reviewed changes

Merge branch 'develop' into manancodes/message_layout_preview_update

7fa50b1

github-actions bot deployed to Netlify July 18, 2023 07:59 View deployment

manancodes added 2 commits July 18, 2023 14:34

Merge branch 'matrix-org:develop' into manancodes/message_layout_prev…

19a12be

…iew_update

Update FontScalingPanel.tsx

3bae541

Marked the class property as optional

4e28b9d

github-actions bot deployed to Netlify July 18, 2023 11:14 View deployment

Optional variable was still giving error.

48263d0

t3chguy reviewed Jul 19, 2023

View reviewed changes

src/components/views/settings/FontScalingPanel.tsx Outdated Show resolved Hide resolved

Merge branch 'matrix-org:develop' into manancodes/message_layout_prev…

67e15a6

…iew_update

github-actions bot deployed to Netlify July 20, 2023 09:27 View deployment

Fix: typescript fail for layoutWatcherRef

40cd969

Manan Sadana and others added 3 commits September 21, 2023 23:35

Merge branch 'develop' of https://github.com/manancodes/matrix-react-sdk

852bdc0

into manancodes/message_layout_preview_update

Fix: using value from SettingStore

d6993ca

Merge branch 'matrix-org:develop' into manancodes/message_layout_prev…

0079d23

…iew_update

github-actions bot deployed to Netlify September 22, 2023 10:13 View deployment

Merge branch 'develop' into manancodes/message_layout_preview_update

2d59dac

t3chguy reviewed Sep 22, 2023

View reviewed changes

src/components/views/settings/FontScalingPanel.tsx Outdated Show resolved Hide resolved

github-actions bot deployed to Netlify September 22, 2023 10:44 View deployment

Update src/components/views/settings/FontScalingPanel.tsx

e70b8f4

Co-authored-by: Michael Telatynski <[email protected]>

t3chguy approved these changes Sep 22, 2023

View reviewed changes

t3chguy enabled auto-merge September 22, 2023 12:54

github-actions bot deployed to Netlify September 22, 2023 12:59 View deployment

Fix: Prettier formatting added for ESList checks

6a9ab1d

auto-merge was automatically disabled September 22, 2023 13:03
Head branch was pushed to by a user without write access

t3chguy enabled auto-merge September 22, 2023 13:04

github-actions bot deployed to Netlify September 22, 2023 13:07 View deployment

Merge branch 'develop' into manancodes/message_layout_preview_update

d04958f

github-actions bot deployed to Netlify September 22, 2023 13:45 View deployment

t3chguy added this pull request to the merge queue Sep 22, 2023

github-merge-queue bot removed this pull request from the merge queue due to failed status checks Sep 22, 2023

t3chguy added this pull request to the merge queue Sep 22, 2023

github-merge-queue bot removed this pull request from the merge queue due to failed status checks Sep 22, 2023

t3chguy added this pull request to the merge queue Sep 22, 2023

Merged via the queue into matrix-org:develop with commit f841757 Sep 22, 2023
16 checks passed

manancodes deleted the manancodes/message_layout_preview_update branch September 27, 2023 15:54

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Message layout will update according to the selected style #10170

Message layout will update according to the selected style #10170

manancodes commented Feb 15, 2023 •

edited by github-actions bot

Loading

weeman1337 left a comment

manancodes commented Feb 16, 2023

manancodes commented Mar 29, 2023 •

edited

Loading

t3chguy left a comment

manancodes commented Jul 18, 2023

t3chguy left a comment

manancodes commented Sep 22, 2023

t3chguy commented Sep 22, 2023

Message layout will update according to the selected style #10170

Message layout will update according to the selected style #10170

Conversation

manancodes commented Feb 15, 2023 • edited by github-actions bot Loading

Checklist

✨ Features

weeman1337 left a comment

Choose a reason for hiding this comment

manancodes commented Feb 16, 2023

manancodes commented Mar 29, 2023 • edited Loading

t3chguy left a comment

Choose a reason for hiding this comment

manancodes commented Jul 18, 2023

t3chguy left a comment

Choose a reason for hiding this comment

manancodes commented Sep 22, 2023

t3chguy commented Sep 22, 2023

manancodes commented Feb 15, 2023 •

edited by github-actions bot

Loading

manancodes commented Mar 29, 2023 •

edited

Loading